// Created by lifei on 2020/7/17--14:29.
<!--hxf-0730-将搜索框所需绑定值传递给子组件，将确定方法重置方法向上传递 -->
<template>
    <div class="v-table" :class="{'box-shadow': !hideShadow}">
        <div class="top-buttons mb12">
            <slot name="buttons"></slot>
        </div>
        <v-search v-if="showSearch"
            :showSelectSearch="showSelectSearch"
            :placeholder="placeholder"
            :totalSearchData="totalSearchData"
            :searchDataFrom="searchDataFrom"
            @searchByKey="$emit('searchByKey', $event)"
            @searchReset="$emit('searchReset', $event)"
            @clearSearchKeyword="$emit('clearSearchKeywords', $event)"
            ref="search"
        />
        <v-pager :pager="pager"
            :selectList="selectList"
            :showSelectTips="showSelectTips"
            @changeCurrentPage="changeCurrentPage"
            @changePageSize="changePageSize"
        />
        <slot name="table"></slot>
    </div>
</template>

<script>
import vPager from './v-pager'
import vSearch from './v-search'

export default {
    name: 'list-page',
    components: {vPager, vSearch},
    props: {
        showSelectTips: {
            type: Boolean,
            default: () => false
        },
        showSearch: {
            type: Boolean,
            default: () => true
        },
        showSelectSearch: {
            type: Boolean,
            default: () => true
        },
        // 搜索框的placeholder
        placeholder: {
            type: String,
            default: '请输入'
        },
        selectList: {
            type: Array,
            default: () => []
        },
        // 分页信息
        pager: {
            type: Object,
            default: () => {

            }
        },
        // 筛选项信息
        totalSearchData: {
            type: Array,
            default: () => []
        },
        // 筛选项返回的表单信息
        searchDataFrom: {
            type: Object,
            default: () => {}
        },
        // 是否隐藏阴影
        hideShadow: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {}
    },
    mounted() {
    },
    methods: {
        searchclose(){
            this.$refs.search.showSearch = false
            this.$refs.search.searchList = []
            this.$refs.search.isActive = {}
        },
        changePageSize(val) {
            this.$emit('changePageSize', val)
        },
        changeCurrentPage(val) {
            this.$emit('changeCurrentPage', val)
        },
        selectionChange(val) {
            this.selectList = val
            this.$emit('selectionChange', val)
        }
    }
}
</script>

<style lang='scss'>
.v-table {
    padding: 16px;
    background-color: white;

    .top-buttons {
        display: flex;
        justify-content: flex-end;
    }
}
</style>
